<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
</head>
<body>
<input type="button" value="新增"><br>
<hr>
<table id="brandTable" border="1" cellspacing="0" width="80%">

<!--    <tr>-->
<!--        <th>序号</th>-->
<!--        <th>品牌名称</th>-->
<!--        <th>企业名称</th>-->
<!--        <th>排序</th>-->
<!--        <th>品牌介绍</th>-->
<!--        <th>状态</th>-->
<!--        <th>操作</th>-->
<!--    </tr>-->
<!--    <tr align="center">-->
<!--        <td>1</td>-->
<!--        <td>三只松鼠</td>-->
<!--        <td>三只松鼠</td>-->
<!--        <td>100</td>-->
<!--        <td>三只松鼠，好吃不上火</td>-->
<!--        <td>启用</td>-->
<!--        <td><a href="#">修改</a> <a href="#">删除</a></td>-->
<!--    </tr>-->

<!--    <tr align="center">-->
<!--        <td>2</td>-->
<!--        <td>优衣库</td>-->
<!--        <td>优衣库</td>-->
<!--        <td>10</td>-->
<!--        <td>优衣库，服适人生</td>-->
<!--        <td>禁用</td>-->

<!--        <td><a href="#">修改</a> <a href="#">删除</a></td>-->
<!--    </tr>-->

<!--    <tr align="center">-->
<!--        <td>3</td>-->
<!--        <td>小米</td>-->
<!--        <td>小米科技有限公司</td>-->
<!--        <td>1000</td>-->
<!--        <td>为发烧而生</td>-->
<!--        <td>启用</td>-->

<!--        <td><a href="#">修改</a> <a href="#">删除</a></td>-->
<!--    </tr>-->


</table>

<script src="js/axios-0.18.0.js"></script>

<script>

    window.onload = function () {
        axios({
            method: "get",
            url: "selectAllJSONServlet"
        }).then(function (resp) {
            let brands = resp.data;
            let tableData = "<tr>\n" +
                "        <th>序号</th>\n" +
                "        <th>品牌名称</th>\n" +
                "        <th>企业名称</th>\n" +
                "        <th>排序</th>\n" +
                "        <th>品牌介绍</th>\n" +
                "        <th>状态</th>\n" +
                "        <th>操作</th>\n" +
                "    </tr>";

            for (let i = 0; i < brands.length; i++) {
                let brand = brands[i];
                // alert(brand.brandName);

                tableData += "    <tr align=\"center\">\n" +
                    "        <td>"+ (i + 1) +"</td>\n" +
                    "        <td>" +brand.brandName + "</td>\n" +
                    "        <td>" +brand.companyName + "</td>\n" +
                    "        <td>" +brand.ordered + "</td>\n" +
                    "        <td>" +brand.description + "</td>\n" +
                    "        <td>" +brand.status + "</td>\n" +
                    "        <td><a href=\"#\">修改</a> <a href=\"#\">删除</a></td>\n" +
                    "    </tr>";

            }
            document.getElementById("brandTable").innerHTML = tableData;

        })
    }

</script>

</body>
</html>